const webpack = require("webpack")
const path = require("path")
// step. 1 引入插件
const HtmlWebpackPlugin = require('html-webpack-plugin');
console.log(path.resolve(__dirname,'./build') ,'传智路径')
const VueLoaderPlugin = require('vue-loader/lib/plugin')
module.exports = {
    mode: "development", // production(生产)  development(开发模式)
    entry: {
        app: './src/js/main.js',
    },
    output:{
        path:path.resolve(__dirname,'./build') ,
        filename:'[name].js'
    },
    devServer: {
        compress: false,
        open: true  // 配置是否自动打开浏览器
    },
// 其它配置
    module: {
        rules: [
            {
                test:/\.css/,
                use:[
                    'style-loader','css-loader','postcss-loader'
                ]
            },
            {
                test:/\.less$/,
                use:[
                    { loader: 'style-loader' },
                    
                    {
                    loader: 'css-loader',
                    options: {
                        modules: true
                    }
                    },
                    'less-loader','postcss-loader'
                ]
            },
            {
                test:/(\.png|\.svg)$/,
                use:[
                   
                    {
                        loader:'url-loader',
                        options:{
                            limit: 1024*3,
                        }
                    }
                ]
            },
            { test: /\.js$/, exclude: /node_modules/, loader: "babel-loader" },
            {
                test: /\.vue$/,
                loader: 'vue-loader'
              }
        ],
    },
    plugins:[
        new HtmlWebpackPlugin({
            filename: 'index.html',
            title:'传智播客',
            template: './index.html'
        }),
        new VueLoaderPlugin()
    ]
}
/*
webpack({
    mode: "production"
})
*/